<template>
	<view class="page padding-lr">
		<view class="text-lg text-333 padding-tb-sm text-bold">{{i18n['选择开店套餐']}}</view>
		<view class="bg-white padding margin-bottom item" v-for="(item, index) in list" :key="index" @click="handlePackage(item.id,index)">
			<view class="padding-bottom-sm radius text-df flex justify-between align-center solid-bottom">
				<text class="text-theme">{{ item.name }}</text>
				<view class="text-price price">{{ item.money }}/{{i18n['年']}}</view>
			</view>
			<!-- <view class="padding-tb radius solid-bottom text-df flex justify-between align-center">
				<view>套餐名称</view>
				<view >{{ item.description }}</view>
			</view> -->
			<view class="padding-tb-sm radius  text-df flex justify-between align-center solid-bottom">
				<view>{{i18n['最大商品添加数量']}}</view>
				<view >{{ item.goods_num }}个</view>
			</view>
			<view class="padding-tb-sm radius  text-df flex justify-between align-center">
				<view>{{i18n['平台抽成比例']}}</view>
				<view >{{ item.merchant_ratio+'%' }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: []
		};
	},
	onLoad() {
		this.store_level();
	},
	methods: {
		store_level() {
			this.$api
				.post(global.apiUrls.store_level)
				.then(res => {
					console.log(res);
					if (res.data.code == 1) {
						this.list = res.data.data;
					} else {
						this.$message.info(res.data.msg);
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		handlePackage(id,index) {
			let store_joinin_id = uni.getStorageSync('store_joinin_id') || 0;
			let store_user_id = uni.getStorageSync('store_user_id') || 0;
			this.$api
				.post(global.apiUrls.submitLevel, { store_level: id },{
					header:{
						Storeid:store_joinin_id,
						Userid:store_user_id
					}
				})
				.then(res => {
					console.log(res);
					if (res.data.code == 1) {
						uni.navigateTo({
							url: `/pages/goods/shop/shop-authentication/index?type=${index}`
						});
					} else {
						this.$message.info(res.data.msg);
					}
				})
				.catch(err => {
					console.log(err);
				});
		}
	}
};
</script>

<style lang="scss" scoped>
.price {
	padding: 10rpx 24rpx;
	// color: #F02325;
	background: #F8F8F8;
	border-radius: 32rpx;
}
.item{
  border-radius: 16rpx;
}
</style>
